import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';

class ProgressDemo extends StatefulWidget {
  @override
  State<StatefulWidget> createState() => _ProgressState();
}

class _ProgressState extends State<ProgressDemo> {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('进度指示器'),
        centerTitle: true,
      ),
      body: Column(
        // LinearProgressIndicator和CircularProgressIndicator都是取父容器的尺寸作为绘制的边界
        // 可以通过尺寸限制类Widget，如ConstrainedBox、SizedBox 来指定尺寸
        children: <Widget>[
          Padding(
            padding: EdgeInsets.only(top: 20),
            // 模糊进度条(会执行一个动画)
            child: LinearProgressIndicator(
              backgroundColor: Colors.grey[200],
              valueColor: AlwaysStoppedAnimation(Theme.of(context).accentColor),
            ),
          ),
          Padding(
            padding: EdgeInsets.only(top: 20),
            child: SizedBox(
              height: 3,
              // 进度条显示50%
              child: LinearProgressIndicator(
                backgroundColor: Colors.grey[200],
                valueColor:
                    AlwaysStoppedAnimation(Theme.of(context).accentColor),
                value: .5,
              ),
            ),
          ),
          Padding(
            padding: EdgeInsets.only(top: 20),
            child: CircularProgressIndicator(
              backgroundColor: Colors.grey[200],
              valueColor: AlwaysStoppedAnimation(Theme.of(context).accentColor),
              strokeWidth: 4,
            ),
          ),
          Padding(
            padding: EdgeInsets.only(top: 20),
            child: SizedBox(
              width: 100,
              height: 100,
              child: CircularProgressIndicator(
                backgroundColor: Colors.grey[200],
                valueColor:
                    AlwaysStoppedAnimation(Theme.of(context).accentColor),
                value: .5,
                strokeWidth: 4,
              ),
            ),
          )
        ],
      ),
    );
  }
}
